<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>frame</title>
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<link rel="stylesheet" type="text/css" href="../css/api.css" />
		<link rel="stylesheet" type="text/css" href="../css/common.css" />
		<style>
			html, body {
				width: 100%;
				min-height: 100%;
				background: #f0f0f0;
			}
			.fr {
				float: right;
			}
			.fl {
				float: left;
			}
			.hightitem {
				background-color: #fff;
			}
			/* 2X2样式 */
			.row {
				display: -webkit-box;
				display: -webkit-flex;
				display: flex;
			}
			.col {
				-webkit-box-flex: 1;
				-webkit-flex: 1;
				flex: 1;
				position: relative;
			}
			.col img {
				position: absolute;
				right: 0;
				width: 80px;
				top: 0;
			}
			.col .matrixcell {
				display: table-cell;
				vertical-align: middle;
				padding-left: 10px;
			}
			.col .matrixcell .title {
				margin-bottom: 10px;
			}
			.matrix {
				display: table;
				height: inherit;
			}
			.home-tuan-list .item {
				position: relative;
				display: block;
				padding-left: 10px;
			}
			.home-tuan-list .cnt {
				padding: 7px 10px 10px 0;
				display: box;
				display: -webkit-box;
				display: -webkit-flex;
				display: flex;
				height: 58px;
				background-size: auto 1px;
			}
			.home-tuan-list .pic {
				margin-right: 10px;
				background: center;
			}
			.home-tuan-list img {
				width: 60px;
				height: 56px;
				margin-top: 7px;
				margin-bottom: 5px;
				border-radius: 3px;
			}
			.home-tuan-list .wrap {
				-webkit-box-flex: 1;
				-webkit-flex: 1;
				flex: 1;
			}
			.home-tuan-list .wrap2 {
				display: table;
				height: 88px;
				width: 100%;
			}
			.home-tuan-list .content {
				-webkit-box-flex: 1;
				-webkit-flex: 1;
				flex: 1;
				box-flex: 1;
				display: table-cell;
				vertical-align: middle;
			}
			.home-tuan-list .shopname {
				color: #333; /*line-height: 16px;*/
				font-size: 17px;
				max-width: 11em;
				white-space: nowrap;
				word-wrap: normal;
				text-overflow: ellipsis;
				overflow: hidden;
				min-height: 10px;
				padding-bottom: 2px;
				padding-top: 1px;
				display: inline-block;
			}
			.home-tuan-list .title {
				color: #666;
				line-height: 16px;
				font-size: 13px;
				max-height: 30px;
				overflow: hidden;
				padding-top: 3px;
				display: -webkit-box;
				display: -webkit-flex;
				display: flex;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
				-webkit-flex-flow: column;
				flex-flow: column;
			}
			.home-tuan-list .comment {
				margin-bottom: 16px;
				position: relative;
			}
			.home-tuan-list .comment span {
				vertical-align: middle;
				color: #666;
				font-size: 12px;
			}
			.home-tuan-list .symbol {
				font-size: 14px;
				color: #f60;
				display: block;
				margin-top: 1px;
			}
			.home-tuan-list .sale {
				color: #f63;
				border: solid 1px #ff916e;
				padding: 3px 2px 2px;
				font-size: 10px;
				border-radius: 2px;
				-webkit-border-radius: 2px;
				margin-left: 5px;
				line-height: 10px;
				height: 10px;
			}
			.home-tuan-list .tuanimg img {
				float: left;
				width: 16px;
				height: 16px;
				margin-left: 3px;
			}
			.home-tuan-list .classify {
				color: #666;
				font-size: 14px;
			}
			.home-tuan-list .price, .index-rec .home-tuan-list .o-price, .index-rec .home-tuan-list .distance, .index-rec .home-tuan-list .sale {
				display: block;
				line-height: 15px;
				font-size: 12px;
			}
			.Fix:after {
				display: block;
				content: '';
				height: 0;
				clear: both;
			}
			.presshover {
				background-color: #57EDB1;
			}
		</style>
	</head>
	<body>
		<!-- 1 列表 -->
		<div class="home-tuan-list">
			<!--<a href="" class="item Fix hightitem" tapmode="presshover" onclick="openNewWin('mytaskDetail_win','mytaskDetail_window.html');">
			<div class="cnt">
			<img class="pic" src="../image/tasks.png">
			<div class="wrap">
			<div class="wrap2">
			<div class="content">
			<div class="shopname">
			山亭区徐庄镇双山村双山崩塌巡查
			</div>
			<div class="comment">
			<span class="classify"> <font color="red">待办</font> 分配时间 2015-12-10 14:30:20 </span>
			</div>
			</div>
			</div>
			</div>
			</div> </a>-->
		</div>
	</body>
	<script type="text/javascript" src="../script/api.js"></script>
	<script src="../script/jquery.min.js"></script>
	<script src="../script/jquery.sha1.js"></script>
	<script type="text/javascript" src="../script/common.js"></script>
	<script type="text/javascript">
		var _pageSize = 10;
		var _pageCount = 0;
		//最近一次时间
		var latestTime = null;
		//最远一次时间
		var lastTime = null;
		$api.setStorage("currentPage", 1);
		// 默认设置为第一页
		//最新时间
		apiready = function() {
			initData();
			refreshData();
			// 结合上拉刷新：
			api.addEventListener({
				name : 'scrolltobottom',
				extra : {
					threshold : 0 //设置距离底部多少距离时触发，默认值为0，数字类型
				}
			}, function(ret, err) {
				var _page = parseInt($api.getStorage("currentPage"));
				if (lastTime != null) {
					var x = parseJsDateTime(lastTime);
					//var a = formatDateToStandard(x, '121');
					var b = new Date(x);
					var c = b.add(-1);
					var d = formatDateToStandard(c, '121');
					if (_page + 1 <= _pageCount) {
						api.getPrefs({
							key : 'PID'
						}, function(ret, err) {
							var accVal = ret.value;
							if (accVal && accVal != "") {
								api.getPrefs({
									key : 'token'
								}, function(ret, err) {
									var token = ret.value;
									if (token && token != "") {
										getMissions(accVal, null, d, '', _page, token, -1);
									}
								})
							}
						});
						$api.setStorage("currentPage", _page + 1);
						// 页码+1
					} else {
						api.toast({
							msg : '没有更多数据了！',
							location : 'bottom'
						});
					}
				}
			});
		}
		function initData() {
			api.getPrefs({
				key : 'PID'
			}, function(ret, err) {
				var accVal = ret.value;
				if (accVal && accVal != "") {
					api.getPrefs({
						key : 'token'
					}, function(ret, err) {
						var token = ret.value;
						if (token && token != "") {
							api.showProgress({
								style : 'default',
								animationType : 'fade',
								title : '加载数据中',
								text : '请稍后...',
								modal : false
							});
							getMissions(accVal, null, null, '', 1, token, 0);
						}
					})
				}
			});
		}

		function refreshData() {
			api.setRefreshHeaderInfo({
				visible : true,
				// loadingImgae: 'wgt://image/refresh-white.png',
				bgColor : '#f2f2f2',
				textColor : '#4d4d4d',
				textDown : '下拉刷新...',
				textUp : '松开刷新...',
				showTime : true
			}, function(ret, err) {
				if (latestTime != null) {
					var x = parseJsDateTime(latestTime);
					var b = new Date(x);
					var c = b.add(1);
					var d = formatDateToStandard(c, '121');
					api.getPrefs({
						key : 'PID'
					}, function(ret, err) {
						var accVal = ret.value;
						if (accVal && accVal != "") {
							api.getPrefs({
								key : 'token'
							}, function(ret, err) {
								var token = ret.value;
								if (token && token != "") {
									getMissions(accVal, d, null, '', 1, token, 1);
								}
							})
						}
					})
					api.refreshHeaderLoadDone();
				}
			})
		}

		function getMissions(userId, startTime, endTime, stateCode, pageIndex, token, loadState) {
			$.ajax({
				url : siteUrl + 'AjaxHandler.ashx?class=AjaxMissions&method=QueryByCondition',
				type : 'POST',
				data : {
					missionId : '',
					userId : userId,
					allocId:'',
					wgId : '',
					startTime : startTime,
					endTime : endTime,
					stateCode : stateCode,
					pageIndex : pageIndex,
					pageSize : _pageSize
				},
				headers : {
					"X-APICloud-Appkey" : getAppKeyInSha1(),
					"Token" : token
				},
				success : function(json) {
					api.hideProgress();
					if (json.total > 0) {
						var html = "";
						var arrMission = json.rows
						if (loadState == 0) {
							var recordCount = json.total;
							_pageCount = (recordCount % _pageSize) === 0 ? (recordCount / _pageSize) : parseInt(recordCount / _pageSize) + 1;
							latestTime = arrMission[0].ALLOCTIME;
							lastTime = arrMission[arrMission.length - 1].ALLOCTIME;
						} else if (loadState == 1) {
							latestTime = arrMission[0].ALLOCTIME;
						}
						$.each(arrMission, function(index, item) {
							html += "<a href='' class='item Fix hightitem' tapmode='presshover' onclick='openDetailWin(\"mytaskDetail_win\",\"mytaskDetail_window.html\",\"" + item.GUID + "\",\"" + item.STATE + "\");'>";
							html += '<div class="cnt"><img class="pic" src="../image/tasks.png"><div class="wrap"><div class="wrap2"><div class="content">';
							html += '<div class="shopname">' + item.MISSIONDESC + '</div><div class="comment"><span class="classify">';
							if (item.STATE == "02") {
								html += '<font color="red">' + item.STATEDESC + '</font>';
							} else{
							html += item.STATEDESC;
							}
							
							if (item.ALLOCTIME != null && item.ALLOCTIME != '') {
								var tmpTime = parseJsDateTime(item.ALLOCTIME);
								item.ALLOCTIME = formatDateToStandard(tmpTime, '120');
							}
							html += ' 分配时间 ' + item.ALLOCTIME + '</span></div></div></div></div></div></a>'
						})
						if (loadState == -1) {
							$(".home-tuan-list").append(html);
						} else {
							$(".home-tuan-list").prepend(html);
						}
						api.parseTapmode();
					} else {
					}
				},
				error : function(e) {
					api.hideProgress();
					
					api.toast({
						msg : '获取任务数据失败',
						location : 'middle'
					});
//					alert("获取数据失败：" + e);
				},
				cache : false
			});
		}

		function openDetailWin(winName, winUrl, missionId,state) {
			api.openWin({
				name : winName,
				url : winUrl,
				rect : {
					x : 0,
					y : 0,
					w : 'auto',
					h : 'auto'
				},
				pageParam : {
					mid : missionId,
					clstate:state
				},
				bounces : false,
				delay : 300,
				animation : {
					type : 'push',
					subType : 'from_right',
					duration : 500
				}
			});
		}
	</script>
</html>
